import React from "react";
import useImmer from "../../hooks/useImmer";
interface InfoProps{
    age:number
}
interface IDefaultStateProps{
    name:string,
    info:InfoProps
}
export default function Immer(){
    const defaultState:IDefaultStateProps = {
        name:'zzz',
        info:{
            age:0
        }
    };
    const [ state, setStateWithImmer ] = useImmer<IDefaultStateProps>(defaultState);

    const handleClick = ()=> {
        setStateWithImmer((draft:IDefaultStateProps)=>{draft.info.age = draft.info.age+1;});
        console.log(defaultState, 'defaultStatedefaultStatedefaultState');
    };
    return (
        <div>
            <span>
                姓名: {state.name}
            </span>
            <span>
                年龄: {state.info.age}
            </span>
            <button onClick={handleClick}>  + </button>
        </div>
    );
}
